<template>
  <div class="mt10">
    <app-block>
      <zm-form :model="searchForm" ref="searchForm" inline>
        <zm-form-item prop="name" v-if="isDraft">
          <zm-input
            v-model="searchForm.name"
            placeholder="输入方案名称查询"
            class="w200"
          ></zm-input>
        </zm-form-item>
        <template v-if="!isDraft">
          <zm-form-item prop="productName">
            <zm-input
              v-model="searchForm.productName"
              placeholder="输入产品名称查询"
              class="w200"
            ></zm-input>
          </zm-form-item>
          <zm-form-item prop="programId">
            <zm-input
              v-model="searchForm.programId"
              placeholder="输入方案ID查询"
              class="w200"
            ></zm-input>
          </zm-form-item>
          <zm-form-item prop="orderNo">
            <zm-input
              v-model="searchForm.orderNo"
              placeholder="输入销售单号查询"
              class="w200"
            ></zm-input>
          </zm-form-item>
          <zm-form-item prop="type">
            <zm-data-select
              v-model="searchForm.type"
              :list="typeList"
              class="w150"
              clearable
              placeholder="业务类型"
            >
            </zm-data-select>
          </zm-form-item>
        </template>
        <zm-form-item>
          <zm-button @click="onSearch" t="search"></zm-button>
          <zm-button @click="onReset" t="reset"></zm-button>
        </zm-form-item>
        <div>
          <zm-form-item
            label="审批状态："
            id="productConfigRadioNone"
            prop="checkStatus"
          >
            <zm-data-radio
              is-btn
              :list="CHECK_TYPE"
              v-model="searchForm.checkStatus"
              @change="onSearch"
            />
          </zm-form-item>
        </div>
        <div>
          <zm-form-item label="适用范围：" v-if="!isDraft" prop="exchangeRange">
            <zm-data-radio
              ref="exchangeRadio"
              is-btn
              :list="PRODUCT_EXCHANGE"
              v-model="searchForm.exchangeRange"
              @change="onSearch"
            />
          </zm-form-item>
        </div>
      </zm-form>
      <zm-button
        v-if="searchForm.checkStatus === '3'"
        class="mb10"
        size="mini"
        icon="el-icon-edit"
        @click="handleEditAll"
        :disabled="tableParams.selectList.length === 0"
      >
        修改
      </zm-button>
      <zm-table-data
        :data="tableParams.data"
        :columns="columns"
        :fetch="loadList"
        :table-params="tableParams"
        :show-page="true"
        :mutilple="searchForm.checkStatus === '3'"
        @selection-change="getSelectionIds"
      >
      </zm-table-data>
    </app-block>
    <!-- 编辑特殊节假日 -->
    <set-special-rule
      v-model="specialRuleParams.visible"
      v-if="specialRuleParams.visible"
      :id="specialRuleParams.id"
      :params="specialRuleParams.params"
      :is-sale-order="true"
      @re-load="loadList"
    ></set-special-rule>
    <!-- 详情 -->
    <detail
      type="specialPrice"
      v-model="isShowDetail"
      v-if="isShowDetail"
      :id="detailID"
      :is-show-btn="false"
      :draft-id="draftID"
    ></detail>
  </div>
</template>

<script>
import tableMixin from '@/mixins/zmTableMixin'
import { typeList, columns } from './const'
import productProgramApis from '@/api/src/productProgram'
import SetSpecialRule from '../SetSpecialRule'
import Detail from '@/components/DetailContainer'
import DraftApis from '@/api/src/draft'
import { CHECK_TYPE, PRODUCT_EXCHANGE, PROCESS_TYPE } from '@/model'
import approveApis from '@/api/src/approve'

export default {
  name: 'PlanConfig',
  components: { SetSpecialRule, Detail },
  mixins: [tableMixin],
  data () {
    return {
      CHECK_TYPE,
      PROCESS_TYPE,
      typeList,
      PRODUCT_EXCHANGE,
      searchForm: {
        name: '',
        productName: '',
        programId: '',
        orderNo: '',
        exchangeRange: '1',
        type: '',
        checkStatus: '3'
      },
      isShowDetail: false,
      detailID: '',
      specialRuleParams: {
        visible: false
      },
      draftID: ''
    }
  },
  computed: {
    columns () {
      return columns(this)
    },
    isDraft () {
      return ['2', '1', '4'].includes(this.searchForm.checkStatus)
    }
  },
  watch: {},
  created () {},
  methods: {
    async loadList () {
      let _res
      if (this.isDraft) {
        _res = await DraftApis.getPageList(
          this.assignQuery({ ...this.searchForm, type: '8' })
        )
      } else {
        _res = await productProgramApis.getPageListBySaleOrder(
          this.assignQuery(this.searchForm)
        )
      }
      this.initialTableData(_res.list, _res.count)
    },
    onEdit (row) {
      this.specialRuleParams = {
        visible: true,
        id: row.programId,
        params: {
          isApprove: '1',
          orderId: row.orderId
        }
      }
    },
    onRemodify (row) {
      // 草稿重新编辑需要多传三个参数
      if (this.isDraft) {
        this.specialRuleParams = {
          visible: true,
          id: row.relationId,
          params: {
            isApprove: '1',
            orderId: row.orderId,
            draftId: row.draftId
          }
        }
      } else {
        this.specialRuleParams = {
          visible: true,
          id: row.programId,
          params: {
            isApprove: '1',
            orderId: row.orderId
          }
        }
      }
    },
    onDetail (row) {
      this.isShowDetail = true
      this.detailID = this.isDraft ? row.relationId : row.programId
      this.draftID = this.isDraft ? row.draftId : ''
    },
    // 批量修改
    handleEditAll () {
      const selectedArr = this.tableParams.selectList
      const _count = selectedArr.length
      let text = this.searchForm.exchangeRange === '1' ? '线上' : '线下'
      const productTypeList = Array.from(
        new Set(selectedArr.map((i) => i.productType))
      )
      if (productTypeList.length > 1) {
        this.$message.warning('所选数据产品类型不一致，无法同时修改！')
        return
      } else {
        this.$confirm(
          `已选 ${_count} 条${text}数据，确定进行节假日方案修改？`,
          '批量修改'
        )
          .then(async () => {
            this.specialRuleParams = {
              visible: true,
              id: selectedArr[0].programId,
              params: {
                isApprove: '1',
                orderId: selectedArr.map(i => i.orderId).join(',')
              }
            }
          })
          .catch((err) => err)
      }
    },
    // 提交审批,获取详情->update->submit
    async onSubmit (row) {
      await approveApis.checkApprove({processType: PROCESS_TYPE.saleOrderSpecialConfig})

      // 草稿取relationId
      const getInfoID = this.isDraft ? row.relationId : row.programId
      let res = {}
      if (!this.isDraft) {
        const getInfoData = await productProgramApis.getInfo({ id: getInfoID })
        res = await productProgramApis.update({
          ...getInfoData,
          isApprove: '1',
          orderId: row.orderId
        })
      }
      await approveApis.submit({
        processType: PROCESS_TYPE.saleOrderSpecialConfig,
        linkName: row.programName,
        businessId: getInfoID,
        draftId: this.isDraft ? row.draftId : res.draftId
      })
      this.$message.success('操作成功')
      this.onSearch()
    },
    // 撤销审批
    async onBackApproval (row) {
      await approveApis.cancel({
        businessId: row.relationId,
        draftId: row.draftId,
        processType: PROCESS_TYPE.saleOrderSpecialConfig
      })
      this.$message.success('操作成功')
      this.onSearch()
    }
  }
}
</script>

<style scoped lang='scss'>
</style>
